Estoy publicando una imagen y obteniendo la imagen procesada como respuesta del backend. El problema está en la parte de respuesta. No puedo mostrar la imagen haga lo que haga.
En primer lugar, Postman funciona. Entonces, el backend está bien, veo la respuesta de la imagen en cartero. En cualquier caso, esta es la parte relacionada del backend de FastAPI:
for img in results.imgs: bytes_io = io.BytesIO() img_base64 = Image.fromarray(img) img_base64.save(bytes_io, format="jpeg") return Response(content=bytes_io.getvalue(), media_type="image/jpeg")Probé axios y obtuve ambos.
La respuesta de Axios se ve así con los encabezados: (Obtengo 200)
"data": "����", "headers": Object { "content-length": "86387", "content-type": "image/jpeg", "date": "Thu, 05 May 2022 17:45:03 GMT", "server": "uvicorn", },Los datos se ven raros como puedes ver.
Este es el código:
axios.post("http://10.0.0.3:8000/object-to-img", body, { headers: { "Content-Type": "multipart/form-data", }, }) .then(function (response) { setImage("data:image/jpeg;base64," + response.data); }) .catch(function (error) { console.log(error); });Y así es como trato de visualizarlo:
<Image style={{ flex: 1, width: 500, height: 500, resizeMode: "contain", }} source={{ uri: image }} /> El método .fetch() de React Native simplemente ni siquiera puede analizar la cosa. JSON Parse error: Unrecognized token '�'
Haga lo que haga, no puedo mostrar la imagen.